iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 21
0
Modern Web

每個人都可以做出理想中的網站!系列 第 21

Day21-CSS設計(6) / 版面設計(2)-Box Model(上)

  • 分享至 

  • xImage
  •  

關於版面設計的區塊模型,是一種把區塊分為很多層的設計方法。

CSS Box Model

就是把一個div當作是好~大一個盒子,然後有很多個小盒子,一層裝著一層。
來看說明圖吧!
https://ithelp.ithome.com.tw/upload/images/20191007/20120965DHH6ztCWmO.png

沒錯,一個div區塊我們可以把他看成四個部分的組成:

  • margin
  • border
  • padding
  • content
    每一個部分都有自已要負責的功能,不管是物件對外和其他物件之間的設定,還是物件內部的內容和邊框設計,都直接包含在這裡面了。

上一篇
Day20-CSS設計(5) / 版面設計(1)
下一篇
Day22-CSS設計(7) / 版面設計(3)-Box Model(中)
系列文
每個人都可以做出理想中的網站!30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言